.wrapper {
    border: 1px solid blue;
    margin: 25px auto;
}

/* 设置弹性容器的样式 */
.flex-container {
    display: flex;
    border: 1px solid purple;
    width: 300px;
    height: 300px;
}

/* 弹性项目的样式 */
.flex-item {
    
}

/* 偶数 */
.flex-item:nth-child(2n) {
    background: #ff0;
}

/* 奇数 */
.flex-item:nth-child(2n+1) {
    background: #dfdfdf;
}

/* 两个class选择器之间没有任何空格 */
.first.flex-container {
    flex-direction: row;
}

/* 使用> 表示选择亲子元素 */
.first>.flex-item {
    flex-basis: 50px;
}